<template>
  <div class="info box radial-gradient-demo">
    <div class="infocontainer">
      <img src="../assets/img/back.png" class="back" @click="$router.replace('/main')" />
      <div class="title">历史项目（部分）</div>
      <div class="infobtnbox clmstart">
        <button class="infobtn" v-for="item in nowlist" :key="item.name" @click="toLink(item.link)">
          {{ item.name }}
        </button>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      nowlist: [
        {
          name: "唯宝-产品展示",
          link: "https://h5.mahelei.com/Before/Weibao/index.html",
        },
        {
          name: "复兴-照片互动",
          link: "https://h5.mahelei.com/Before/Fuxing/index.html",
        },
        {
          name: "舍得-产品展示",
          link: "https://h5.mahelei.com/Before/Shede/index.html",
        },
        {
          name: "雷朋-翻翻乐",
          link: "https://h5.mahelei.com/Before/Leipeng/index.html",
        },
      ],
    };
  },
  methods: {
    toLink(e) {
      setTimeout(() => {
        window.location.href = e;
      }, 300);
    },
  },
};
</script>
<style lang="less" scoped>
.info {
  overflow-y: scroll;

  .infocontainer {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 3;

    .title {
      width: 100%;
      padding-top: 6rem;
      font-size: 2.5rem;
      font-weight: bolder;
      color: #000;
      text-align: center;
    }

    .infobtnbox {
      width: 100%;
      height: auto;
      padding-top: 10rem;

      button {
        margin-bottom: 4rem;
      }

      .infobtn:first-child {
        margin-top: 3rem;
      }
    }
  }
}
</style>
